const { useState, useEffect, useContext } = React;
const { message, Spin, Button } = antd;

const typeMappingOfCn = {
    1: '管理员',
    2: '老师',
    3: '学生',
};

function Load() {
    const identity = useContext(IdentityContext);
    const { loading, data = {} } = useRequest(
        () => {
            return new Promise(resolve => {
                request
                    .get('/user/userInfoByType')
                    .then(res => {
                        resolve(res);
                    })
                    .catch(err => {
                        resolve({});
                        message.error('获取信息失败');
                        console.log(err);
                    });
            });
        },
        {
            manual: false,
        }
    );

    const renderUserInfo = () => {
        switch (identity && identity.type) {
            case 1:
                return null;
            case 2:
                return null;
            case 3:
                return (
                    <React.Fragment>
                        <tr key='sex'>
                            <td>性别：</td>
                            <td>{data.sex != undefined ? (data.sex ? '男' : '女') : ''}</td>
                        </tr>
                        <tr key='class'>
                            <td>班级：</td>
                            <td>{data.class_id}</td>
                        </tr>
                        <tr key="department">
                            <td>院系</td>
                            <td>{data.department.name}</td>
                        </tr>
                    </React.Fragment>
                );
            default:
                return null;
        }
    };

    return (
        <div style={{ display: 'flex', flexDirection: 'column', justifyContext: 'center', alignItems: 'center' }}>
            <Spin spinning={loading}>
                <h1 style={{ boxSizing: 'border-box', paddingTop: '100px' }}>个人信息</h1>
                <table style={{ transform: 'translateX(-50%)', marginTop: '50px' }}>
                    <tbody>
                        <tr key='id'>
                            <td>id：</td>
                            <td>{data.no}</td>
                        </tr>
                        <tr key='name'>
                            <td>姓名：</td>
                            <td>{data.user && data.name}</td>
                        </tr>
                        <tr key='type'>
                            <td>身份：</td>
                            <td>{data.user && typeMappingOfCn[data.user.type]}</td>
                        </tr>
                        {renderUserInfo()}
                    </tbody>
                </table>
            </Spin>
        </div>
    );
}
